html, body {
    background-color: #f1f5f9;
    margin: 0; /* 移除默认外边距 */
    padding: 0; /* 移除默认内边距 */
    height: 100%; /* 设置高度为视口的100% */
}

.container-login {
    margin: auto; /* 水平居中 */
    width: 50%; /* 或根据需要调整宽度 */
    max-width: 600px; /* 设置最大宽度 */
    display: flex;
    justify-content: center; /* 水平居中显示 */
    align-items: center; /* 垂直居中显示 */
    height: 100%; /* 设置高度为视口的100% */
}

.login-dialog {
    width: 100%;
    max-width: 600px; /* 将最大宽度从400px修改为600px */
    padding: 20px;
    border-radius: 10px;
    border: 1px solid gray;
    background-color: white;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

.login-dialog h3 {
    text-align: center;
    margin-bottom: 20px; /* 增加底部外边距 */
}

.login-dialog .row {
    margin-bottom: 15px; /* 行间距 */
    display: flex;
    align-items: center; /* 垂直居中对齐 */
}

.login-dialog .row > span {
    margin-right: 10px; /* 标签与输入框之间的间距 */
    white-space: nowrap; /* 防止标签换行 */
}

.login-dialog .row > input {
    flex-grow: 1; /* 输入框占据剩余空间 */
    height: 35px;
    border: 1px solid #ccc; /* 边框颜色调整为浅灰色 */
    border-radius: 5px;
    padding: 0 10px; /* 内边距 */
    outline: none;
}

.login-dialog button {
    width: 100%;
    color: white;
    background-color: #007bff; /* 按钮背景颜色 */
    border: none;
    border-radius: 5px;
    padding: 10px 0;
    margin-top: 20px; /* 保持这个值或根据需要调整 */
    font-size: 16px; /* 字体大小 */
    cursor: pointer; /* 鼠标悬停时显示指针 */
    transition: background-color 0.3s; /* 背景色渐变效果 */
}

.login-dialog button:hover {
    background-color: #0056b3; /* 鼠标悬停时按钮背景颜色变深 */
}